import React, { useState } from 'react'
import store from '../store/index'
/* 
使用Redux的主要优势之一是它可以帮你处理应用的共享状态。如果两个组件需要访问同一状态，该怎么办？
这种两个组件同时需要访问同一状态的现象称为“共享状态”。
你可以将该状态提升到附近的父组件，但是如果该父组件在组件树中向上好几个组件的位置，
那么将状态当做属性向下一个一个地传递，这项工作很快就会变得乏味。此外，在该父组件和该子组件之间的组件甚至根本不需要访问该状态！
 */

export default function Redux0002() {
    const [count, setCount] = useState(store.getState())
    
    const chgstr = () => {
        setCount(store.getState() )
    }
    store.subscribe(chgstr)
    return (
        <div>
            {count}
            <br />
            <button onClick={() => store.dispatch({ type: 'add' })}>相加1</button>
            <button onClick={() => store.dispatch({ type: 'sup' })}>相减1</button>
        </div>
    )
}